<script type="text/html" data-help-name="ui-page">
    <p>UI Page</p>
    <p>A single screen of content within your Dashboard.</p>
    <h3>Properties</h3>
    <dl class="message-properties">
        <dt>
            UI
            <span class="property-type">ui-base</span>
        </dt>
        <dd>
            The UI (ui-base) that this page will be added to.
        </dd>
        <dt>
            Path
            <span class="property-type">string</span>
        </dt>
        <dd>
            Extending the parent UI path, defines where this page renders
        </dd>
        <dt>
            Icon
            <span class="property-type">string</span>
        </dt>
        <dd>
            The icon to render alongside the page's name in the sidebar of the UI.
            We use the Material Design Icons, you can see a full list of the available icons <a href="https://pictogrammers.com/library/mdi/">here</a>.
            You do not need to include the `mdi-` prefix, just the name of the icon.
        </dd>
        <dt>
            Theme
            <span class="property-type">ui-theme</span>
        </dt>
        <dd>
            Choose from one of the available themes for the page.
            You can also create and customise your own themes.
        </dd>
        <dt>
            Layout
            <span class="property-type">Grid | Fixed | Notebook</span>
        </dt>
        <dd>
            Choose form one of the available Dashboard Layouts.
            You can read more about our layouts <a href="https://dashboard.flowfuse.com/layouts/grid.html">here</a>.
        </dd>
        <dt>
            Class
            <span class="property-type">string</span>
        </dt>
        <dd>
            Any custom CSS classes you want to append to the page's styling when rendered.
        </dd>
    </dl>
</script>
